@import "variables";
.seed-crowd-step1-page{
  z-index: 1;
  padding:0 0 pxTorem(130);
  background:color($h5,c9);
  .seed-crowd-step1{
    position: relative;
    &:before{
      display: block;
      content: '';
      height:pxTorem(15);
      width:100%;
      background:color($h5,c9);
    }
    .seed-crowd-info {
      background: color($h5, c10);
    }
    form li{
      width:100%;
      overflow: hidden;
      padding:pxTorem(30);
      .validator-style{
        display: block;
        width:100%;
        text-align: right;
        padding-right:pxTorem(30);
        padding-top: pxTorem(22);
        font-size: pxTorem(30);
        color: #e94141;
      }
      .crowd-form-info{
        width: 100%;
        justify-content: left;
        line-height: 1;
        align-items: center;
        .crowd-form-clum-name, .crowd-form-step1-input{
          display: flex;
          align-items: center;
          font-size: pxTorem(30);
          color: #999;
          line-height:1;
        }
        .crowd-form-step1-input select{
          direction:rtl;
          -webkit-appearance: none;
          padding:0;
          list-style: none;
          appearance: none;
          line-height: 1;
          outline: none;
          border:none;
          background:none;
          font-size: pxTorem(30);
          color:#999;
        }
        .crowd-form-step1-input select option{
          text-align: right;
        }
        .crowd-form-step1-input i{
          display: inline-block;
          width:pxTorem(20);
          height:pxTorem(30);
          margin-left:pxTorem(10);
          background:url(#{$icons-path}/icon_more.png)left center no-repeat;
          background-size:pxTorem(17) pxTorem(28);
        }
        .crowd-form-clum-name{
          width:38%;
          height:100%;
          line-height: 1;
          color:color($h5,c3);
          justify-content: flex-start;
          margin-right:pxTorem(10);
        }
        .crowd-form-step1-input{
          line-height: 1;
          width:62%;
          height:100%;
          color:color($h5,c4);
          text-align: right;
          justify-content: flex-end;
        }
        .crowd-form-step1-input .value-color{
          color:color($h5,c2);
        }
        textarea{
          width:100%;
          height:pxTorem(130);
          color:#999;
          text-align: right;
          margin:0;
          padding:0 pxTorem(30) 0 0;
          border:none;
          resize: none;
          outline: none;
          font-size: pxTorem(32);
        }
        input{
          width:calc(100% - 2rem);
          text-align: right;
          padding:0;
          line-height: 1;
          margin: 0;
          color:#999;
          font-size: pxTorem(30);
        }
        .active-time {
          display: flex;
        }
        .active-time .active-time-case {
          width: calc(100% - 1.5rem);
          flex-wrap: wrap;
          justify-content: flex-end;
        }
        .active-time .active-time-case>span{
          padding:0 pxTorem(5);
        }
        .active-time .active-time-case p{
          position: relative;
        }
        .active-time .active-time-case p span:first-child{
          display: inline-block;
          height:100%;
          width: 100%;
          font-size: pxTorem(30);
          text-align: center;
        }
        .active-time .active-time-case p span:last-child{
          text-align: center;
          display: inline-block;
          width: 100%;
          height:100%;
          font-size: pxTorem(30);
        }
        .active-time .active-time-case p input{
          width:100%;
          opacity: 0;
          position: absolute;
          top:0;
          left:0;
          color:#999;
          font-size: pxTorem(30);
        }
        .activeName{
          padding-right:pxTorem(30);
        }
        .contactWay{
          padding-right:pxTorem(30);
        }
      }
      .show-input{
        display: none;
      }
    }
    form div:last-child{
      border-bottom:none;
    }
    .seed-crowd-image{
      background: color($h5, c10);
    }
    .seed-crowd-image p{
      font-size: pxTorem(30px);
      color:#666;
      padding:pxTorem(30);
    }
    .seed-crowd-image ul{
      overflow: hidden;
      padding: 0 pxTorem(30);
    }
    .seed-crowd-image ul li{
      float:left;
      width:32%;
      margin-right:2%;
      height:pxTorem(250);
      margin-bottom:2%;
      position: relative;
      background:url(#{$icons-path}/crowd_add_picture.png)center center no-repeat;
      background-size: pxTorem(215) pxTorem(249);
      i{
        position: absolute;
        top:0;
        right:0;
        width:pxTorem(40);
        height:pxTorem(40);
        background:url(#{$icons-path}/clear.png)left center no-repeat;
        background-size:pxTorem(40) pxTorem(40);
      }
      input{
        width:100%;
        height:100%;
        opacity: 0;
        filter:alpha(opacity=0);
        margin-right:pxTorem(8);
      }
      img{
        width:100%;
        height:100%;
      }
    }
    .seed-crowd-image ul li:nth-child(3n){
          margin-right:0;
    }
  }
}
.regio-picker {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10;
}
.showPicker {
   display: block;
}
